<template>
<nav class="navbot">
    <ul>
        <li>
            <router-link to='/index'>
            <a href="javascript:;">
                <img src="images/nav1.png" alt="" class="n_img">
                <img src="images/nav1_h.png" alt="" class="n_img2">
                <p>首页</p>
            </a>
            </router-link>
        </li>
        <li>
            <router-link to='/home'>
            <a href="javascript:;">
                <img src="images/nav2.png" alt="" class="n_img">
                <img src="images/nav2_h.png" alt="" class="n_img2">
                <p>房源</p>
            </a>
            </router-link>
        </li>
        <li>
            <router-link to='/info'>
            <a href="javascript:;">
                <img src="images/nav3.png" alt="" class="n_img">
                <img src="images/nav3_h.png" alt="" class="n_img2">
                <p>资讯</p>
            </a>
            </router-link>
        </li>
        <li>
            <router-link to='/my'>
            <a href="javascript:;">
                <img src="images/nav4.png" alt="" class="n_img">
                <img src="images/nav4_h.png" alt="" class="n_img2">
                <p>我的</p>
            </a>
            </router-link>
        </li>
    </ul>
</nav>
</template>

<script type="text/ecmascript-6">
  export default {
    name:'navv',
    data () {
      return {

      }
    },
    components: {

    }
  }
</script>

<style scoped lang="less" rel="stylesheet/less">
nav.navbot ul .active p {
    color: #ff3739;
}
.navbot ul li .n_img2{
    display:none
}
.navbot ul .active .n_img2{
    display:block
}
.navbot ul .active .n_img{
    display:none
}
</style>
